<!--
 * @Author: wwj 3342930399@qq.com
 * @Date: 2024-03-13 11:57:03
 * @LastEditors: wwj 3342930399@qq.com
 * @LastEditTime: 2024-03-13 13:55:59
 * @FilePath: \vue\src\views\Error\notFound.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
  <div class="notFound">
    <img src="../../assets/images/404.png" alt="" />
    <p @click="goBack">
      <a-icon type="left" />返回登录<span>{{ time }}</span
      >S
    </p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      time: 10,
    };
  },
  created() {
    this.startCountdown();
  },
  methods: {
    startCountdown() {
      this.timer = setInterval(() => {
        if (this.time > 0) {
          this.time--;
        } else {
          clearInterval(this.timer);
          // 在倒计时结束时执行其他操作
          this.$router.push({ name: "login" });
        }
      }, 1000);
    },
    goBack() {
      this.$router.push({ name: "login" });
    },
  },

  beforeDestroy() {
    clearInterval(this.timer); // 在组件销毁前清除定时器
  },
};
</script>

<style lang="scss" scoped>
.notFound {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;

  img {
    margin-top: 200px;
  }
}
</style>
